﻿@{
    ViewBag.Title = "ExtendAlert";
    Layout = "~/Views/Shared/_Page.cshtml";
}

<script src="/JsLib/G_JqExtend.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        //small dialog
        $("#btnSmall").click(function () {
            $("#btnSmall").smallAlert("dialog1", "小型对话框", "JQuery扩展方法确认对话框!");
        });

        //medium dialog
        var content = "你好, Master HaKu!<br />" +
                "欢迎进入JQuery UI的世界!";
        $("#btnMedium").click(function () {
            $("#btnMedium").mediumAlert("dialog2", "中型对话框", content);
        });

        //large dialog
        var cont = "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />" +
                   "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />" +
                   "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />" +
                   "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />" +
                   "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />" +
                   "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />" +
                   "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />" +
                   "这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!这里有很多文字!<br />";
        $("#btnLarge").click(function () {
            $("#btnLarge").largeAlert("dialog3", "大型对话框", cont);
        });
    });
</script>

<h2>ExtendAlert</h2>
<br />
<h3>Path: @ViewBag.Path</h3>
<br />
<h3>Extended JS: /JsLib/G_JqUI.js, G_JqExtend.js</h3>
<br />
<h3>See the result on console</h3>
<br />

<input id="btnSmall" type="button" value="Small Dialog" />
&nbsp;
<input id="btnMedium" type="button" value="Medium Dialog" />
&nbsp;
<input id="btnLarge" type="button" value="Large Dialog" />

